<template>
  <div>
    <el-card class="box-card" style="margin-top:20px">
      <div slot="header" class="clearfix">
        <span>填空题列表</span>
      </div>
      <div class="text item">
        <div class="changeBtn">
          <el-button
            type="primary"
            size="mini"
            :loading="btnLoading"
            style="float: right;margin-left:10px;"
            @click="downloadExcel"
          >生成表</el-button>
          <el-button
            type="primary"
            size="mini"
            :loading="scoreLoading"
            style="float: right;margin-left:10px;"
            @click="calculateScore"
          >计算分值</el-button>
        </div>
        <el-table v-loading="loading" :data="tableList" @selection-change="handleSelectionChange">
          <el-table-column type="selection" width="55" align="center" />
<!--          <el-table-column label="考区" align="center" prop="desc" />-->
          <el-table-column label="科目" align="center" prop="name" />
          <el-table-column label="算分状态" align="center">
            <template slot-scope="scope">
              <span v-if="scope.row.processOfFormalAnswer == 0">未完成</span>
              <span v-if="scope.row.processOfFormalAnswer == 1">已完成</span>
            </template>
          </el-table-column>
          <el-table-column label="小题分表状态" align="center">
            <template slot-scope="scope">
              <span v-if="scope.row.processOfQuesScore == 0">未完成</span>
              <span v-if="scope.row.processOfQuesScore == 1">已完成</span>
            </template>
          </el-table-column>
          <el-table-column label="科目表状态" align="center" prop="processOfSubjectScore">
            <template slot-scope="scope">
              <span v-if="scope.row.processOfSubjectScore == 0">未完成</span>
              <span v-if="scope.row.processOfSubjectScore == 1">已完成</span>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </el-card>
    <fail-list :dialogVisibleFu="dialogVisibleFu" :errorData="errorData" @closeDialog="closeDialog"></fail-list>
  </div>
</template>

<script>
  import {
    queryIsOk,
    getCalculateScoreList,
    formalUpdateScore,
    insertFromDpSubjectScore,
    updateScoreProcess,
    queryTsinghuaFormalAnswerErr,
    queryInsertProcess,
    queryInsertQuesErr
  } from "@/api/toolsystem/grade";
  import failList from "@/components/ToolSystem/Grade/failList";
  import Cookies from "js-cookie";
  export default {
    name: "singleSubjectList",
    components:{
      failList
    },
    data() {
      return {
        // 遮罩层
        loading: false,
        // 表格数据列表
        tableList: [],
        // 选中数组
        ids: [],
        dialogVisibleFu: false, // 控制弹框显示与隐藏
        errorData:[], // 错误数据表格
        scoreLoading: false,// 计算分值loading
        btnLoading: false,// 生产表loading
        percentage: 0,// 上传进度
        timerProcess: null,// 进度定时器
        timerError: null,// 错误请求定时器
        importStatus: 'biaokao',
      };
    },
    watch:{
      percentage(value){
        if(this.percentage==100){
          this.ids=[];
          this.getList();
          this.btnLoading = false
          this.scoreLoading = false
          setTimeout(()=>{
            this.$root.globalDialog = false
          },2000)
          clearInterval(this.timerError);
          clearInterval(this.timerProcess);
          this.msgSuccess('操作成功')
        }
      },
    },
    created() {
      this.getList();
      const type = Cookies.get("tool_system_grade_selectExam")
      if(type==1){
        this.importStatus = "xiaozhao"
      }else if(type==2){
        this.importStatus = "biaokao"
      }
    },
    methods: {
      // 关闭弹框
      closeDialog(val){
        this.dialogVisibleFu = val
      },

      // 查询是否可以执行,true可通行； false不可通行
      queryIsOk() {
        return queryIsOk()
          .then(res => {
            if (res.code != 200) {
              return false;
            }
            if (res.data.isOk) {
              return true;
            } else {
              this.msgInfo(res.data.msg)
              return false;
            }
          })
          .catch(error => {
            console.log(error)
            return false;
          })
      },
      // 生成表按钮
      downloadExcel(){
        if (this.ids.length <= 0) {
          return this.msgInfo("请选择需要生成表的科目");
        }
        const ids = this.ids.join(",")
        this.$confirm('是否确认对id为"' + ids + '"的科目生成表?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(async () => {
            let status = await this.queryIsOk()
            if(!status){
              return;
            }
            this.btnLoading = true
            this.percentage = 0
            this.$root.percentage = 0
            this.$root.globalDialog = true
            insertFromDpSubjectScore(this.importStatus,ids);
            this.timerProcess = setInterval(()=>{
              this.queryProcess();
            }, 10000)

            this.timerError = setInterval(()=>{
              this.queryInsertQuesErr();
            }, 10000)
          })
          .catch(()=>{
          this.msgInfo("取消操作");
        });
      },
      // 生成表-查询进度
      queryProcess(){
        queryInsertProcess().then(response => {
          console.log(response)
          if (response.code != 200) {
            return;
          }
          this.percentage = Number(response.msg);
          this.$root.percentage = Number(response.msg);
        }).catch(error=>{
          console.log(error);
        })
      },
      // 生成表-查询生成表错误
      queryInsertQuesErr(){
        queryInsertQuesErr().then(response => {
          console.log(response);
          if (response.code != 200) {
            return;
          }
          if(response.data){
            clearInterval(this.timerError);
            clearInterval(this.timerProcess);
            this.btnLoading = false;
            this.$root.globalDialog = false
            this.errorData = response.data;
            this.dialogVisibleFu = true;
          }
        }).catch(error=>{
          console.log(error)
        })
      },

      // 计算分值按钮
      calculateScore(){
        if (this.ids.length <= 0) {
          return this.msgInfo("请选择需要计算分值的科目");
        }
        const ids = this.ids.join(",")
        this.$confirm('是否确认对id为"' + ids + '"的科目计算分值?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(async () => {
            let status = await this.queryIsOk()
            if(!status){
              return;
            }
            this.scoreLoading = true
            this.percentage = 0
            this.$root.percentage = 0
            this.$root.globalDialog = true
            formalUpdateScore(ids);
            this.timerProcess = setInterval(()=>{
              this.updateScoreProcess();
            }, 10000)

            this.timerError = setInterval(()=>{
              this.queryScoreAnswerErr();
            }, 10000)
          })
          .catch(() => {
            this.msgInfo("取消删除");
          });
      },
      // 计算分值-查询进度
      updateScoreProcess(){
        updateScoreProcess().then(response => {
          console.log(response)
          if (response.code != 200) {
            return;
          }
          this.percentage = Number(response.data);
          this.$root.percentage = Number(response.data);
        }).catch(error=>{
          console.log(error);
        })
      },
      // 计算分值-查询计算分值错误
      queryScoreAnswerErr(){
        queryTsinghuaFormalAnswerErr().then(response => {
          console.log(response)
          if (response.code != 200) {
            return;
          }
          if(response.data){
            clearInterval(this.timerError);
            clearInterval(this.timerProcess);
            this.scoreLoading = false
            this.$root.globalDialog = false
            this.errorData = response.data;
            this.dialogVisibleFu = true;
          }
        }).catch(error=>{
          console.log(error)
        })
      },

      /** 查询科目列表 */
      getList() {
        this.loading = true;
        getCalculateScoreList()
          .then(response => {
            console.log(response)
            if (response.code != 200) {
              this.loading = false;
              return this.msgError(response.msg);
            }
            this.tableList = response.data;
            this.loading = false;
          })
          .catch(error => {
            this.loading = false;
            console.log(error);
          });
      },
      // 多选框选中数据
      handleSelectionChange(selection) {
        console.log(selection)
        this.ids = selection.map(item => item.relationSubjectId);
      },
    }
  };
</script>

<style scoped>
  @import "../../../assets/styles/card.scss";
  .el-progress.excel{
    margin-bottom: 20px;
  }
</style>

